// 通用 Toast 工具，适配 shadcn-vue 风格，使用内联 style 保证可见
let toastRoot: HTMLElement | null = null;

export function showToast(message: string, type: 'error' | 'success' | 'info' = 'info', duration = 3000) {
  if (!toastRoot) {
    toastRoot = document.createElement('div');
    toastRoot.id = 'shadcn-toast-root';
    toastRoot.style.position = 'fixed';
    toastRoot.style.top = '24px';
    toastRoot.style.right = '24px';
    toastRoot.style.zIndex = '9999';
    document.body.appendChild(toastRoot);
  }
  const toast = document.createElement('div');
  let bg = '#64748b'; // 默认灰色
  if (type === 'error') bg = '#dc2626'; // 红色
  if (type === 'success') bg = '#16a34a'; // 绿色
  toast.style.cssText = `
    margin-bottom: 8px;
    padding: 8px 16px;
    border-radius: 6px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
    color: #fff;
    font-size: 14px;
    font-weight: 500;
    background: ${bg};
    opacity: 1;
    transition: opacity 0.3s;
    animation: fade-in-down 0.3s;
  `;
  toast.textContent = message;
  toastRoot.appendChild(toast);
  setTimeout(() => {
    toast.style.opacity = '0';
    setTimeout(() => {
      toastRoot && toastRoot.removeChild(toast);
    }, 300);
  }, duration);
}

// 注入动画样式
if (!document.getElementById('shadcn-toast-style')) {
  const style = document.createElement('style');
  style.id = 'shadcn-toast-style';
  style.innerHTML = `
@keyframes fade-in-down {
  0% { opacity: 0; transform: translateY(-20px); }
  100% { opacity: 1; transform: translateY(0); }
}
`;
  document.head.appendChild(style);
} 